<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>大迁视界 - Odyssey Of Wildlife</title>
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <script src="./js/index.js"></script>
    <header>
        <div class="logo">
            <img src="./css/src/md-pets@1x.png" alt="Logo">
            <span>odyssey of wildlife</span>
        </div>
        <nav>
            <ul>
                <li><a href="./2Dsection/myCesium/src/Cesium1.html" class="active">开始</a></li>
                <li><a href="./2Dsection/myCesium/src/Cesium1.html">科普展示</a></li>
                <li><a href="./3Dsection/game.html">互动游戏</a></li>
                <li><a href="./Knowledge_git/homepage.html">科学知识库</a></li>
                <li><a href="#">关于我们</a></li>
            </ul>
        </nav>
        <div class="user-actions">
            <a href="#" class="profile-btn" id="profileButton">
                <img src="./css/src/user-icon.png" alt="User">
                <span>个人主页</span>
            </a>
            
            <a href="login.html" class="login-btn">Login / Register</a>
        </div>
        
    </header>
    
    <main>
        <div class="hero-content">
            <h1>大迁视界</h1>
            <h2>Odyssey Of Wildlife</h2>
            <button class="start-btn">start</button>
        </div>
    </main>
    
    <!-- 个人信息弹窗 -->
<!-- 个人信息弹窗 -->
<div id="profileModal" class="modal">
    <div class="modal-content">
        <span class="close">&times;</span>
        <h2>个人信息</h2>
        <div class="info-container">
            <div class="info-row">
                <div class="info-label">用户名：</div>
                <div class="info-value" id="usernameValue">张先生</div>
            </div>
            <div class="info-row">
                <div class="info-label">身份：</div>
                <div class="info-value" id="roleValue">学生</div>
            </div>
            <div class="info-row">
                <div class="info-label"></div>
                <button class="verify-btn">完成身份认证</button>
            </div>
        </div>
    </div>
</div>
</body>
</html>